<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>视频教学网</title>
		<link rel="stylesheet" href="../layui/css/layui.css" media="all">
		<style type="text/css">
			html,body{
				width: 100%;
				padding:0rem;
				margin: 0px;
			}
			.top{
				display: flex;
				align-items: center;
				flex-flow: row nowrap;
				justify-content: space-between;
				width: 80%;
				padding:10px 10%;
				border-bottom:1px solid #ededed;
			}
			.icon_box{
				display: flex;
				flex-flow: column;
				color:#1E9FFF
			}
			.icon_box>div:nth-child(1){
				font-family: STXingkai;
				font-size: 30px;
			}
			.tip{
				display: flex;
				align-items: center;
			}
			.main{
				
			}
			.login_btn{
				font-weight: 800;
				font-size: 20px;
				margin-left: 10px;
			}
			#search_input{
				height: 20px;
				border-radius: 15px;
				border: 1px solid #1E9FFF ;
				padding: 5px;
				width: 200px;
			}
			#search_btn{
				border-radius: 15px;
				border: 1px solid #1E9FFF ;
				padding: 5px;
				background-color:#1E9FFF ;
			}
		</style>
	</head>
	<body>
		<div id="container">
			<div class="top">
				<div class="icon_box">
					<div>视频教学网</div>
					<div>www.videostudy.com</div>
				</div>
				<div>
					<form class="layui-form" action="">
						<input type="text" placeholder="搜索感兴趣的课程" id="search_input" autocomplete="off">
						<button lay-submit lay-filter="formDemo" id="search_btn">
							<i class="layui-icon">&#xe615;</i>
						</button>
					</form>
				</div>
				<div class="tip">
					<img src="../img/账号.svg" width="20px" height="20px" />
					<span class="login_btn">登录 / 注册</span>
				</div>
			</div>
			<div class="main">
				
			</div>
		</div>
	</body>
</html>
